<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

	<h:head>

	</h:head>
	  
	<h:body>
	<h:form>
    <div class="card">
        <p:dataTable var="item" value="#{dtBasicView.items}" size="small" stripedRows="true" rows="10" id="mydata"
                     paginator="true"
                     paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                     currentPageReportTemplate="{startRecord}-{endRecord} of {totalRecords} records"
                     rowsPerPageTemplate="5,10,{ShowAll|'All'}">
            <p:column headerText="Code">
                <h:outputText value="#{item.id}" />
            </p:column>

            <p:column headerText="Name">
                <h:outputText value="#{item.name}" />
            </p:column>

            <p:column headerText="Category">
                <h:outputText value="#{item.category}" />
            </p:column>

            <p:column headerText="Quantity">
                <h:outputText value="#{item.price}" />
            </p:column>
        </p:dataTable>
         <p:commandButton  action="#{dtBasicView.addRandom}" update="mydata" value="Add Random" icon="ui-icon-check" style="margin:0"/>  		
        
    </div>
</h:form>
	
	</h:body>
</html>